
import React from 'react';
import $ from 'jquery';
var NavLink=require('../modules/NavLink');
export default class New extends React.Component{
    constructor(props){
        super(props);
        this.state={
            lists:[]
        }
    }
    render(){
        const Listview=this.state.lists.map((list,index)=>{
            return <li className="playlist__item">
                      <div className="playlist__item_box">
		                    <div className="playlist__cover mod_cover">
                                 <NavLink to={`/Detail/${list.song_id}`} className="js_album">
                                  <img id={index} src={list.pic_big} className="playlist__pic"/>
                                  <i className="play_icon"></i>
                                </NavLink>
                               
                                
                            </div>
		                    <h4 className="playlist__title">
                                
                                {list.title}
                            </h4>
		                    <div className="playlist__author">
				                <a href="##" className="js_singer" style={{color:'#333'}}>
                                  {list.author}  
                                </a>	
		                    </div>
                            <div className="playlist__other">
                                 {list.publishtime} 
                            </div>
	                    </div>
                    </li> 
        })
        return(
            <div className="mod_playlist mod_playlist--all"> 
                <ul className="playlist__list">
                    {Listview}
                </ul>
            </div>
        )

    }
    componentDidMount(){
        var that=this;
        $.ajax({
            type:"GET",
            url:'http://tingapi.ting.baidu.com/v1/restserver/ting?format=json&calback=&from=webapp_music&method=baidu.ting.billboard.billList&type=25&size=20&offset=0',
            dataType:"jsonp",
            success:function(data){
                var arr=data.song_list;
                that.setState({
                    lists:arr
                })
            }

    })
    }
}
